<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>综合练习</title>
		<style>
			body{
				font: 12px "simhei",Arial,Helvetica,sans-serif;
				color: #666;
				text-align: center;
			}
			div{
				width: 198px;
				height: 233px;
				background-color: #e8e8e8;
			}
			#intro_p{
				font-size: 12px;
				color: #000;
				margin: 0 0 6px 0;
			}
			#price_p{
				font-size: 12px;
				color: #0aa1ed;
				margin: 6px 0;
			}
			a{
				width: 100px;
				height: 24px;
				background-color: #0aa1ed;
				/* 改为块级元素要设置margin，因为块级元素不收上级元素影响 */
				display: block;
				margin: 0 auto;
				/* 如果设置成行内块的话不需要再次设置
				margin行内块是受上级元素影响的 */
				display: inline-block;
				line-height: 24px;
				text-decoration: none;
				color: #fff;
				border-radius: 5px;
			}
		</style>
	</head>
	<body>
		<div>
			<img src="http://doc.vrd.net.cn/tstore_v1/
			images/itemCat/study_computer_img3.png" alt="">
			<p id="intro_p">戴尔(DELL)XPS13-9360-R1609<br>13.3英寸微边框笔记本电脑</p>
			<p id="price_p">￥6888.00</p>
			<a href="">查看详情</a>
		</div>
	</body>
</html>